<!DOCTYPE html>
<html>

<head>
<title>CS570 Web Benchmarking - NoCL Particles | Viehdorfer &amp; Pearson</title>
<meta charset='utf-8'> 
<META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW">

<script id="vertex-shader" type="x-shader/x-vertex">
uniform mat4		uModelViewMatrix;
uniform mat4		uProjectionMatrix;
attribute vec3		aVertex;
attribute vec3		aColor;
varying lowp vec3	vColor;
attribute float		vParticleSize;

void main( )
{
	vColor = aColor;
	gl_PointSize = 3.;
	gl_Position = uProjectionMatrix * uModelViewMatrix * vec4(aVertex,1.);
}
</script>


<script id="fragment-shader" type="x-shader/x-fragment">
#ifdef GL_ES
precision highp float;
#endif

varying lowp vec3	vColor;

void main( )
{
	gl_FragColor = vec4( vColor, 1. );
}
</script>


<link rel="stylesheet" href="../common/css/jquery-ui.custom.min.css">
<style>#slider { margin: 10px; }</style>

<script src="../common/js/jquery.min.js"></script>
<script src="../common/js/jquery-ui.custom.min.js"></script>

<script type="text/javascript"> 
	// Particle settings
	var version = 'noCL';
	var NUMPARTICLES = 1024;
	var NUMMEASURES = 30000;
	var particles = new Array(NUMPARTICLES);
	var startingPos = new Array(0, 0, 0);
</script>

<script type="text/javascript" src="../common/js/Webgl-Utils.js"></script>
<script type="text/javascript" src="../common/js/mouse.js"></script>
<script type="text/javascript" src="../common/js/helpers.js"></script>
<script type="text/javascript" src="js/particles.js"></script>
<script type="text/javascript" src="js/InitShaders.js"></script>
<script type="text/javascript" src="../common/js/GlMatrix.js"></script>
<script type="text/javascript" src="js/sampledata.js"></script>
<script type="text/javascript" src="js/sample.js"></script>

<script type="text/javascript" src="../common/js/timer.js"></script>

<script type="text/javascript">
	$(document).ready(function() {
		$( "#slider" ).slider( );
		$( "#slider" ).slider( "option", "min",   0.1  );
		$( "#slider" ).slider( "option", "max",   2.0  );
		$( "#slider" ).slider( "option", "value", 1.0  );
		$( "#slider" ).slider( "option", "step",  0.01 );
		$( "#slider" ).slider( "option", "orientation", "horizontal" );
		$( "#slider" ).slider( "enable" );
	});
	
	window.onload = InitGraphics;	// function to call first
</script>

</head>

<body>

	<button id="PerspButton">Perspective</button>
	<button id="OrthoButton">Orthographic</button>

	<div id="slider"></div>

	<canvas id="gl-canvas" width="512" height="512">
		Your browser doesn't support the HTML5 canvas element
	</canvas>
	
</body>
</html>
